<template>
    <van-popup v-model="visible" :style="{ padding: '10px', width: '80vw', height: '80vh' }">
        <van-nav-bar :title="keyName" left-text="关闭" @click-left="visible = false;" right-text="选择"
            @click-right="selectword" />
        <com-keyword-edit2 :prop-name="propName" :isCompare="true" :key-name="keyName"
            ref="keywordEdit2" prop-type="select"></com-keyword-edit2>
        <!-- <van-row>
            <van-col span="24">
                <van-search placeholder="请输入搜索关键词" v-model="searchKeyword" />
            </van-col>
        </van-row>
        <van-row>
            <van-col span="16"><van-field label="" placeholder="请输入" v-model="addkeyword" /></van-col>
            <van-col span="8"><van-button type="primary" size="small" style="float:right;margin-top: 5px;"
                    @click="addword">添加</van-button></van-col>
        </van-row>
        <van-row v-for="item in filterManagerList" :key="item.id">
            <van-col span="2"><van-checkbox v-model="item.checked" style="margin-top:10px;"></van-checkbox></van-col>
            <van-col span="14"><van-field v-model="item.keyword" label="" placeholder="请输入" /></van-col>
            <van-col span="8">
                <van-button type="primary" size="small" style="float:right;margin-top: 5px;margin-left:5px;"
                    @click="editword(item.id)">保存</van-button>
                <van-button type="danger" size="small" style="float:right;margin-top: 5px;"
                    @click="delword(item.id)">删除</van-button>
            </van-col>
        </van-row> -->
    </van-popup>
</template>
<script>

import { Toast } from 'vant'
import comKeywordEdit2 from '../comAllTypeJobs/comKeywordEdit2.vue';
export default {
    name: 'comKeywordPopup',
    model: {
        prop: "value",
        event: "change",
    },
    components: {
        comKeywordEdit2
    },
    props: {
        propName: String,
        keyId: String,
        keyName: String,
        value: {
            type: Boolean,
            default: false
        }
    },
    computed: {
        filterManagerList() {
            if (this.searchKeyword)
                return this.managerList.filter(m => m.keyword.includes(this.searchKeyword));
            else
                return this.managerList;

        }
    },
    data() {
        return {
            isActionSuccessed: false,
            searchKeyword: '',
            addkeyword: '',
            identityChk: ['0', '1'],
            visible: false,
            managerList: []
        }
    },
    watch: {
        value(val) {
            //console.log(1,val);
            this.visible = val;
        },
        visible(val) {
            console.log(2, val);
            this.$emit("change", val);
            if (val) {
                this.$nextTick(()=>{
                    this.$refs.keywordEdit2.getList();
                })
            }
        }
    },
    methods: {
        selectword() {
            var params1 = {
                propName: this.propName,
                keyName: this.keyName,
                ids: this.$refs.keywordEdit2.getCheckedIds()
            };
            this.$api.keyword.keywordUpdateSelect(params1).then(res => {
                if (res.code === 200) {
                    Toast('操作成功！')
                } else {
                    Toast('错误！')
                }
            })
            //this.$emit("select-change", this.managerList.filter(m => m.checked).map(m => m.keyword).join(','));
            this.visible = false;
        },
        // getList() {
        //     var isPersionalLogin = loginType.isPrivatePersionLogin();
        //     var params = {
        //         isPersionalLogin,
        //         keyName: this.keyName,
        //         propName: this.propName,
        //         isCompare: true
        //     };
        //     var that = this;
        //     this.$api.keyword.keywordList(params).then(res => {
        //         if (res.code === 200) {
        //             if (that.isActionSuccessed) {
        //                 Toast('操作成功！')
        //                 that.isActionSuccessed = false
        //             }
        //             that.managerList = res.data.map(m => {
        //                 var t = that.managerList.find(x => x.id == m.id);
        //                 if (t)
        //                     m.checked = t.checked;
        //                 return m;
        //             });
        //         } else {
        //             Toast('系统出错！')
        //         }
        //     })
        // },
        // addword() {
        //     if (!this.addkeyword) {
        //         Toast('请填写关键字！')
        //         return;
        //     }
        //     var params = {
        //         propType: 'select',
        //         propName: this.propName,
        //         keyName: this.keyName,
        //         keyId: this.keyId,
        //         isPrivate: loginType.isPrivatePersionLogin(),
        //         keyword: this.addkeyword,
        //         isSelected: true,
        //         keywordContent: '',
        //         isCompare: true
        //     };
        //     var that = this;
        //     this.$api.keyword.keywordAdd(params).then(res => {
        //         if (res.code === 200 && res.data) {
        //             //Toast('操作成功！')
        //             that.isActionSuccessed = true;
        //             that.addkeyword = '';
        //             that.getList();
        //         } else {
        //             Toast('系统出错！')
        //         }
        //     })
        // },
        // editword(id) {
        //     var that = this;
        //     var ary = this.managerList.filter(m => m.id == id);
        //     if (ary.length == 1) {
        //         var that = this;
        //         if (!ary[0].keyword) {
        //             Toast('请填写关键字！')
        //             return;
        //         }
        //         this.$api.keyword.keywordUpdate(ary[0]).then(res => {

        //             if (res.code === 200 && res.data) {
        //                 that.isActionSuccessed = true;
        //                 //Toast('操作成功！')
        //                 that.getList();
        //             } else {
        //                 Toast('系统出错！')
        //             }
        //         })
        //     }
        // },
        // delword(id) {
        //     var params = {
        //         id
        //     };
        //     var that = this;
        //     this.$api.keyword.keywordDelete(params).then(res => {
        //         if (res.code === 200 && res.data) {
        //             that.isActionSuccessed = true;
        //             that.getList();
        //             //Toast('操作成功！')
        //         } else {
        //             Toast('系统出错！')
        //         }
        //     })
        // }
    },
    mounted() {
        if (this.value) {
            this.visible = true;
        }
    }
}
</script>

<style scoped>
.colortext::v-deep .van-field__label,
.colortext::v-deep .van-radio__label,
.colortext::v-deep .van-checkbox__label,
.colortext::v-deep .van-field__control {
    color: #323233 !important;
}
</style>
